<template>
  <uni-grid class="uni-grid" :column="3">
    <uni-grid-item v-for="(item, index) in list" :key="index">
      <view class="uni-video" @tap="click(item, index)">
        <video
          class="uni-video"
          :id="'Video' + index"
          ref="video123"
          :src="item.url"
          mode="aspectFit"
          :autoplay="false"
          :show-center-play-btn="false"
          :show-speed-rate-btn="false"
          :controls="false"
          :poster="item.cover"
          token="OBo7ncWSqtX7sPPss/jrS3SjfTNBCOrgvC4j1bDbAmI="
        ></video>
      </view>
    </uni-grid-item>
  </uni-grid>
</template>

<script setup lang="ts">
import { computed } from "vue";
const p = defineProps<{ file: Eps.BaseUserCommentEntity["resultsFile"] }>();
const list = computed(() => {
  return p.file || [];
});
function click(item: any, index: number) {
  videoinit(
    item.url,
    list.value.map((c) => c.url)
  );
}
function videoinit(str: string, list: string[]) {
  uni.setStorageSync("videokey", str);
  uni.setStorageSync("videolist", list);
  uni.navigateTo({
    url: "/pages/video/index",
  });
}
</script>

<style scoped>
.uni-grid {
  width: calc(100vw - 64px);
}

.uni-video {
  width: 100%;
  height: 100%;
}
</style>
